import React from 'react';
import { View, Input, Text } from '@tarojs/components';
import { backgroundObj } from '@/utils/utils'
import Router from '@/utils/router';
import './index.scss'
export default (props) => {
  const { setToolPopVisible, liveObjStatus, handleInputChange, inputValue, data = {}, account = {}, useData = {}, setLive_default, setVisibleShare, renderStyle, fetchList, handleSendMessage, active } = props
  const { goodsBaseInfo = {}, directLiveInfo
    = {}, mainAdminInfo = {}, goodsCommerceList = [] } = data
  const { content, picture } = goodsBaseInfo
  const { playUrl, liveStatus, warmUp, warmUpType, startTime, commerceGoodsAmount = 0, screenType } = directLiveInfo
  const { profile: img, username: name
  } = mainAdminInfo
  const { username, unionId, openId, organizationId, profile, token } = account
  const { onlineCount } = useData
  return <View className='landscape_box'>
    <View className='landscape_top_fixed'>
      <View className='landscape_top_profile'>
        <View className='landscape_profile_img' style={{ ...backgroundObj(img) }}></View>
        <View className='landscape_profile_name font_hide'>讲师：{name}</View>
      </View>
      <View className='landscape_top_right'>
        <View className='landscape_top_look'>在线{onlineCount}</View>
        <View className='landscape_top_share' onClick={() => setVisibleShare(true)}></View>
      </View>
    </View>
    <View className='Landscape_icon_spPosition' onClick={() => setLive_default()}></View>
    <View className={'liveInteraction_hp_box'}>
      {renderStyle === 'default' && active !== 'hd' ? null : token ? <View className="liveInteraction_bottom">
        <Input
          value={inputValue}
          placeholder='快来发表你的感想吧'
          onInput={handleInputChange}
          disabled={liveObjStatus === '0'}
          className="liveInteraction_input"
        />
        <Text className='liveInteraction_Outline' onClick={() => setToolPopVisible({ show: true })}></Text>
        <Text className='liveInteraction_OutShop' onClick={fetchList}>{commerceGoodsAmount}</Text>
        <Text className='liveInteraction_Send' onClick={handleSendMessage}></Text>
      </View> : <View className="liveInteraction_Send_login">
        <View onClick={() => Router('login')}><Text style={{ color: '#FF6B4D' }}>登录</Text>发弹幕，参与主播互动</View>
      </View>}
    </View>
  </View>
}